<!-- 检测记录统计 -->
<div class="layuimini-container">
	
	<div class="layuimini-main" style="margin: 10px; padding:10px;">

		<!-- 条件搜索  start-->
		<form class="layui-form" action="">

			<div class="layui-inline">
				<label class="layui-form-label">所属总店</label>
				<div class="layui-input-inline">
					<select name="headStore" lay-filter="headStore">
						<option value="">请选择</option>
						<option value="400012">北京同仁堂大药房</option>
						<option value="400013">老百姓大药房</option>
					</select>
				</div>
			</div>
			
			<div class="layui-inline">
				<label class="layui-form-label">所属分店</label>
				<div class="layui-input-inline">
					<select name="subStore" lay-filter="subStore">
						<option value="">请选择</option>
						<option value="400012-12">湘雅路分店</option>
						<option value="400013-12">星沙分店</option>
						<option value="400012-15">四方坪分店</option>
					</select>
				</div>
			</div>
			
			<div class="layui-inline">
				<label class="layui-form-label">筛选日期</label>
				<div class="layui-input-inline">
					<input class="layui-input" placeholder="开始日" name="start" id="start" autocomplete="off"/>
				</div>
				<div class="layui-input-inline">
					<input class="layui-input" placeholder="截止日" name="end" id="end" autocomplete="off"/>
				</div>
			</div>

			<!-- 搜索按钮 -->
			<div class="layui-inline">
				<button type="submit" id="search" lay-filter="data-search-btn" lay-submit class="layui-btn layui-btn-normal"><i class="fa fa-search"></i> 查询 </button>
				<button type="submit" id="export" class="layui-btn layui-btn-normal"><i class="fa fa-bar-chart"></i> 导出报表 </button>
			</div>
		</form>
	</div>
		
	<div class="layuimini-main" style="margin: 10px; padding:10px;">
		<!-- 表格：数据表格 -->
		<table class="layui-hide" id="table-jcjlbb"></table>
	</div>
	
</div>


<style>
.layui-table-cell {
    font-size:14px;
    padding:0 5px;
    height:auto;
    overflow:visible;
    text-overflow:inherit;
    white-space:normal;
    word-break: break-all;
}
</style>

<script src="lib/jquery-3.4.1/jquery-3.4.1.min.js" charset="utf-8"></script>
<script src="lib/jq-module/paigusu.min.js" charset="utf-8"></script>
<script>
	//引用
	layui.use(['form', 'table', 'miniPage', 'element', 'layer', 'layarea', 'laydate'], function() {
		//初始化声明
		var $ = layui.jquery,
			form = layui.form, //将layui中的form组件对象定义成form
			table = layui.table,
			miniPage = layui.miniPage,
			layer = layui.layer,
			layarea = layui.layarea,
			laydate = layui.laydate;

		//渲染form表单
		form.render();
		
		//日期
		laydate.render({
			elem: '#start'
		});
		
		laydate.render({
			elem: '#end'
		});

	

		//对table进行初始化
		table.render({
			elem: '#table-jcjlbb',
			url: 'http://localhost:8004/sccMedicalResult',
			cols: [
				[
					{type: 'numbers',title: '序号', align: 'center'},
					{field: 'name',title: '姓名', align: 'center'},
					{field: 'phone',title: '手机号', align: 'center'},
					{field: 'sex',title: '性别', align: 'center', sort: true,
						templet: function(d) {
							return d.sex == 1 ? '男' : '女'
						}
					},
					{field: 'age',title: '年龄', align: 'center', sort: true},
					{field: 'weight',title: '体重', align: 'center', sort: true},
					{field: 'height',title: '身高', align: 'center', sort: true},
					{field: 'gluFoodStatus',title: '饮食状态', align: 'center', sort: true,
						templet: function(d) {
							return d.gluFoodStatus == 1 ? '空腹': d.gluFoodStatus == 2 ? '餐后':'随机'
						}
					},
					{field: 'bmiResult',title: 'BMI', align: 'center', sort: true},
					{field: 'gluResult',title: '血糖', align: 'center', sort: true},
					{field: 'cholResult',title: '总胆固醇', align: 'center', sort: true},
					{field: 'tgResult',title: '甘油三脂', align: 'center', sort: true},
					{field: 'hdlCResult',title: '高密度脂蛋白胆固醇', align: 'center', sort: true},
					{field: 'ldlCResult',title: '低密度脂蛋白胆固醇', align: 'center', sort: true},
					{field: 'tcHdlCResult',title: '总胆/高密', align: 'center', sort: true},
					{field: 'uaResult',title: '血尿酸', align: 'center', sort: true},
					{field: 'ketResult',title: '血酮', align: 'center', sort: true},
					{field: 'hbalcResult',title: '糖化血蛋白', align: 'center', sort: true},
					{field: 'bloodPressure',title: '血压', align: 'center', sort: true},
					{field: 'countOfTest',title: '检测次数', align: 'center', sort: true},
					{field: 'testTime',title: '检测时间', align: 'center', sort: true}
				]
			],
			page: true, //是否显示分页插件
			limits: [10, 20, 30], //定义每页显示多少条记录
			limit: 10, //默认每页 显示15条
			skin: 'line'
		});

		// 监听搜索操作
		form.on('submit(data-search-btn)', function(data) { //当点击搜索按钮时，执行function()函数，data是指form表单中的所有数据
			var result = JSON.stringify(data.field); //将搜索的数据转换成JSON字符串
			layer.alert(result, { //弹出层，显示result（转换后的json字符串）
				title: '最终的搜索信息' //弹出层的标题
			});
			//执行搜索重载
			table.reload('table-jcjlbb', {
				page: { curr: 1 },//当前行是第一行
				where: { data: result }//搜索条件
			}, 'data');
		
			return false;
		});


	});
</script>
